﻿//================================================================================================
//Modules.Layout
//dolamthien@gmail.com
//================================================================================================
LayoutTemplate = {
    Layout: {
        Header: '<RequestParams Type="31" ParentID="644BDBBF-92CF-4E30-9D64-25023E53E642" Context="GetResource" />',
        Footer: '<RequestParams Type="31" ID="406285B1-417C-4072-A14C-9A433599D898" Context="GetResource" />',
        Navigation: '<RequestParams Type="31" ParentID="505FEBCD-2A93-41E5-BEAB-9621AFBDFF70" Context="GetResource" />',
        Slider: '<RequestParams Type="31" ParentID="31F67C41-43E0-4722-A7B4-FF53305B5F55" Context="GetResource" />',
        Categories: '<RequestParams Type="28"  MaxLevel="1"  Context="GetResource" />'
    },
    Product: {
        Menufacturers: '<RequestParams Type="24" MaxLevel="1" Context="GetResource" />',
        Categories: '<RequestParams Type="21" MaxLevel="1" Context="GetResource" />',

        List_MaxViewCount: '<RequestParams Type="22" Context="MaxViewCount" NTop ="5"/>',
        List_NewProduct: '<RequestParams Type="22" Context="GetResource" NTop ="15"/>'
    },
    Load: function (action) {
        var _this = this,
            arr = [];

        arr.push(_this.Layout.Header);
        arr.push(_this.Layout.Navigation);
        arr.push(_this.Layout.Slider);
        //arr.push(_this.Layout.Categories);
        arr.push(_this.Layout.Footer);

        Modules.ServiceData.GetContextData(arr.join(''), function (data) {
            if (data) {
                console.log(data);
                _this.LoadHeader(data[1]);
                _this.LoadNavigation(data[2]);
                _this.LoadSlider(data[3]);
            }
        });
    },
    LoadHeader: function (data) {
        if (data) {
            $logo = $('.header .header-logo');

            $logo.html(data[0].Summary);
        }
        console.log('LoadHeader', data);
    },
    LoadNavigation: function (data) {
        if (data) {
            var temp = '<li><a href="{0}">{1}</a></li>',
                $ul = $('.header-row ul.nav'),
                arr = [];
            $.each(data, function (idx, it) {
                var link = it.Link || '#';
                arr.push($.string.Format(temp, link, it.Name));
            });
            $ul.html(arr.join(''));
        }
    },
    LoadSlider: function (data) {
        if (data) {
            var _this
            temp = '<li>'
                        + '<a href="{0}"><img src="{1}" data-src="{2}" alt=""/></a>'
                        + '<div class="flex-caption">'
                            + '<h2>{3}</h2>'
                            + '{4}'
                            + '<a href="{0}" class="slider-button">Mua ngay</a>'
                        + '</div>'
                    + '</li>';
            var arr = [],
                noimage = Modules.Core.Default.Image,
                loader = Modules.Core.Default.ImageLoader;
            $.each(data, function (idx, it) {
                var h = 'product/?ID=' + it.IDKey, img = it.Image || noimage;                
                arr.push($.string.Format(temp, h, loader, img, it.Name, it.Summary))
            });
            $('.slide-container').find('.slides').html(arr.join(''));
            $('ul.slides li img').unveil(10);
            $.getScript('../../asset/js/jq/plugin/flexslider/jquery.flexslider.js', function () {
                $('.flexslider').flexslider({
                    animation: "fade",              //String: Select your animation type, "fade" or "slide"
                    slideDirection: "horizontal",   //String: Select the sliding direction, "horizontal" or "vertical"
                    slideshow: true,                //Boolean: Animate slider automatically
                    slideshowSpeed: 5000,           //Integer: Set the speed of the slideshow cycling, in milliseconds
                    animationDuration: 500,         //Integer: Set the speed of animations, in milliseconds
                    directionNav: false,             //Boolean: Create navigation for previous/next navigation? (true/false)
                    controlNav: true,               //Boolean: Create navigation for paging control of each clide? Note: Leave true for manualControls usage
                    keyboardNav: true,              //Boolean: Allow slider navigating via keyboard left/right keys
                    mousewheel: false,              //Boolean: Allow slider navigating via mousewheel
                    prevText: "Previous",           //String: Set the text for the "previous" directionNav item
                    nextText: "Next",               //String: Set the text for the "next" directionNav item
                    pausePlay: false,               //Boolean: Create pause/play dynamic element
                    pauseText: 'Pause',             //String: Set the text for the "pause" pausePlay item
                    playText: 'Play',               //String: Set the text for the "play" pausePlay item
                    randomize: false,               //Boolean: Randomize slide order
                    slideToStart: 0,                //Integer: The slide that the slider should start on. Array notation (0 = first slide)
                    animationLoop: true,            //Boolean: Should the animation loop? If false, directionNav will received "disable" classes at either end
                    pauseOnAction: true,            //Boolean: Pause the slideshow when interacting with control elements, highly recommended.
                    pauseOnHover: false,            //Boolean: Pause the slideshow when hovering over slider, then resume when no longer hovering
                    controlsContainer: ".slide-container",          //Selector: Declare which container the navigation elements should be appended too. Default container is the flexSlider element. Example use would be ".flexslider-container", "#container", etc. If the given element is not found, the default action will be taken.
                    start: function () { },            //Callback: function(slider) - Fires when the slider loads the first slide
                    before: function () { },           //Callback: function(slider) - Fires asynchronously with each slider animation
                    after: function () { },            //Callback: function(slider) - Fires after each slider animation completes
                    end: function () { }               //Callback: function(slider) - Fires when the slider reaches the last slide (asynchronous)
                });
            });
        }
    }
};     